import React, { Component } from 'react';
import axios from 'axios';
import BaseHeader from '@/components/base/baseHeader';
import GlobalBottom from '@/components/base/GlobalBottom';
import './../../data.js';
import './shiwenDetail.scss';

class Com extends Component {
  constructor (props) {
    super(props)
    this.state = {}
  }
  componentDidMount () {
    console.log(this.props.match.params.id);
    // const id = this.props.match.params.id;
    axios.get(`/prolist`,{dataType:'json'})
        .then((res) => {
          console.log(res.data.list)
          this.setState({
            list:res.data.list
          })
        })
  }

  render () {
    return (
      <div className="containersWrap">
      <BaseHeader />
        <div className = "containers">
          <div className="shiwen_left">
            <div className="gloabalContent">
              <div className="con">
                <div className="zhushi">
                  <ul className="yi_list">
                    <li>译</li>
                    <li>注</li>
                    <li>赏</li>
                    <li>背</li>
                  </ul>
                </div>
                <div>
                  <h2>将进酒</h2>
                </div>
                <p className="autor">
                  <span>唐代</span>
                  ：
                  <span>李白</span>
                </p>
                <div className="content">
                  <p>
                    君不见，黄河之水天上来，奔流到海不复回。
                    <br />
                    <span className="yi">
                      你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流。
                      <br />
                    </span>
                    <span className="shang">
                      将进酒：属乐府旧题。将（qiāng）：请。君不见：乐府中常用的一种夸语。天上来：黄河发源于青海，因那里地势极高，故称.
                      <br />
                    </span>
                  </p>
                  <p>
                    君不见，高堂明镜悲白发，朝如青丝暮成雪。
                    <br />
                    <span className="yi">
                      你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流。
                      <br />
                    </span>
                    <span className="shang">
                      高堂：高大的厅堂。一说指父母。青丝：黑发。此句意为在高堂上的明镜中看到了自己的白发而悲伤。
                      <br />
                    </span>
                  </p>
                  <p className="appreciation">shang'xi</p>
                  <p>参考资料</p>
                    
                </div>
              </div>
              <div className="tools">
                <ul className="tool_img">
                  <li className="iconfont icon-shoucang">11</li>
                  <li className="iconfont icon-xiaoxi">22</li>
                  <li className="iconfont icon-copy">33</li>
                  <li className="iconfont icon-shoucang">44</li>
                </ul>
              </div>
              <div className="tag">
                <ul className="tag_list">
                  <li>乐府，</li>
                  <li>唐诗，</li>
                  <li>咏物</li>
                </ul>
              </div>
            </div>
            <div className="gloabalContent">
              <div className="con">
                <h2><span>译文及注释</span></h2>
                <p className="detail_yiwen">
                  <b>译文</b><br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流,你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                </p>
                <p className="detail_yiwen">
                  <b>注释</b><br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流,你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                  你难道看不见那黄河之水从天上奔腾而来，波涛翻滚直奔东海，从不再往回流<br />
                </p>
              </div>
            </div>
            <div className="gloabalContent">
              <div className="con">
                <h2><span>创作背景</span></h2>
                <p className="detail_yiwen">
                  &nbsp;&nbsp;&nbsp;&nbsp;关于这首诗的写作时间，说法不一。黄锡珪《李太白编年诗集目录》系于天宝十一载（752）。一般认为这是李白天宝年间离京后，漫游梁、宋，与友人岑勋、元丹丘相会时所作。
                </p>
                
              </div>
            </div>
          
          </div>
          <div className="shiwen_right">
            <div className="globalType">
              <div className="ad">
                <img src="http://pic3.nipic.com/20090520/1242397_100025082_2.jpg" alt=""/>
                <img src="http://wx3.sinaimg.cn/large/006nLajtly1fpi9ikmj1kj30dw0dwwfq.jpg" alt=""/>
                <img src="http://img3.redocn.com/20100622/20100621_8c78a30dc5c10ef5552cwCXmHvkvaDCT.jpg" alt=""/>
              </div>
            </div> 
          </div>
        </div>
        <GlobalBottom />
      </div>
      
    )
  }
}

export default Com;
